<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>  
<!DOCTYPE html>
<html>
<head>
	<title>区域管理</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="decorator" content="default" />
	<%@include file="/WEB-INF/views/include/treeview.jsp"%>
	<style type="text/css">
/* 		.ztree {overflow:auto;margin:0;_margin-top:10px;padding:10px 0 0 10px;} */
	</style>
</head>
<body>
<div class="boxcontent clearfix" style="margin-top: 0;margin-left: 0;margin-right: 0">
	<div class="content clearfix">
			<div class="l-left-small no-border">
				<div class="accordion-heading">
					<a class="accordion-toggle">
						区域管理
						<i class="icon-refresh pull-right" onclick="refreshTree();"></i>
					</a>
				</div>
				<div id="ztree" class="ztree">
				</div>
			</div>
			<div class="l-right-big no-border" style="margin-left: 180px">
				<iframe name="content" id="contentMain" src="${ctx}/sys/area/list" frameborder="false" scrolling="auto" style="border:none;" width="100%" height="550" allowtransparency="true">
				</iframe>
			</div>
			<div class="clear"></div>
	</div>
</div>
	<!-- 返回内容界面 -->
	
	<script type="text/javascript">
		var setting = {data:{simpleData:{enable:true,idKey:"id",pIdKey:"pId",rootPId:'0'}},
			callback:{onClick:function(event, treeId, treeNode){
					var id = treeNode.id == '0' ? '' :treeNode.id;
					$('#contentMain').attr("src","${ctx}/sys/area/list?id="+id+"&parent.id="+id);
				}
			}
		};
		
		function refreshTree(){
			var num = "";
			for (var i = 0; i < 6; i++) {
				num += Math.floor(Math.random() * 10);
			}
			$.getJSON("${ctx}/sys/area/treeData?num="+num,function(data){
				tree = $.fn.zTree.init($("#ztree"), setting, data);
				tree.expandAll(false);
				var treeObj = $.fn.zTree.getZTreeObj("ztree");
				var nodes = treeObj.getNodes();
				if (nodes.length > 0) {
					//展开根节点
					treeObj.expandNode(nodes[0], true, false, true, false);
				}
			});
		}
		
		refreshTree();
		
		$(function(){
			//iframe高度根据子页面高度调整，最小400，左侧栏高度联调，树高度联调
			$("#contentMain").load(function () {
			    var mainheight = $(this).contents().find(".boxcontent").height();
			    mainheight > 550 ? ($(this).height(mainheight),$(".l-left-small").height(mainheight),$("#ztree").css("height",mainheight-50+"px")) : ($(this).height(550),$(".l-left-small").height(550),$("#ztree").css("height","500px"));
			});
		});
		
	</script>	
</body>
</html>